<!DOCTYPE html> <html> <head> <title>Det Kongelige Teater - opgave</title> <style> body { font-family:Georgia, "Times New Roman", Times, serif; } #wrapper { height:750px; width:525px; /* centrering af wrapper - 2 ting: */ /* 1. Width 2. Elastikker i hver side (margin-left/right:auto;)*/ margin-left:auto; margin-right:auto; } #header { height:141px; width:525px; border-top-style:solid; border-top-color:#000; border-top-width:1px; padding-top:7px; border-bottom-style:solid; border-bottom-color:#000; border-bottom-width:1px; } /* nesting, her har jeg fat i alle paragrapher i header */ #header p { font-weight:bold; border-top-style:solid; border-top-color:#000; border-top-width:1px; border-bottom-style:solid; border-bottom-color:#000; border-bottom-width:2px; padding-top:5px; padding-bottom:5px; } #content { height:533px; width:525px; border-top-style:solid; border-top-color:#960D00; border-top-width:17px; } h1 { font-size:60px; margin-top:0px; letter-spacing:-4px; } #content img { border-top-style:solid; border-top-color:#000; border-top-width:3px; padding-top:10px; } #footer { height:50px; width:525px; } </style> </head> <body> <div id="wrapper"> <div id="header"> <img src="img/crown_logo.gif" /> <p>Forestillinger | Om | Kontakt </p> </div><!--header--> <div id="content"> <h1>Opera</h1> <img src="img/detremusketerer_525x177.jpg" /> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer arcu felis, porta eu pulvinar vitae, elementum id sem. Suspendisse in nisi ligula, et vehicula felis.</p> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer arcu felis, porta eu pulvinar vitae, elementum id sem. Suspendisse in nisi ligula, et vehicula felis. Mauris sed cursus erat. Etiam vel enim nec urna tincidunt molestie. Duis sem mauris, imperdiet id egestas et, facilisis eget nulla. </p> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer arcu felis, porta eu pulvinar vitae, elementum id sem. Suspendisse in nisi ligula, et vehicula felis. Mauris sed cursus erat. Etiam vel enim nec urna tincidunt molestie. Duis sem mauris, imperdiet id egestas et, facilisis eget nulla. </p> </div><!--content--> <div id="footer"></div><!--footer--> </div><!--wrapper--> </body> </html>